<template>
    <div class="box">
        <section>
            <div>常用工具</div>
            <ul>
                <li>我的地址</li>
                <li>我的客服</li>
                <li>店铺关注</li>
                <li>评价有礼</li>
            </ul>
        </section>
        <ol>
            <li>
                <div>邀好友赚现金</div>
                <div>最高得15元</div>
                <div><img src="" alt=""></div>
                <div>
                    <button>去邀请</button>
                    <button>查佣金</button>
                </div>
            </li>
            <li>
                <div>邀好友赚现金</div>
                <div>最高得15元</div>
                <div><img src="" alt=""></div>
                <div>
                    <button>去邀请</button>
                    <button>查佣金</button>
                </div>
            </li>
            <li>
                <div>邀好友赚现金</div>
                <div>最高得15元</div>
                <div><img src="" alt=""></div>
                <div>
                    <button>去邀请</button>
                    <button>查佣金</button>
                </div>
            </li>
            <li>
                <div>邀好友赚现金</div>
                <div>最高得15元</div>
                <div><img src="" alt=""></div>
                <div>
                    <button>去邀请</button>
                    <button>查佣金</button>
                </div>
            </li>
        </ol>
    </div>
</template>

<script setup>

</script>

<style scoped>
.box {
    margin-bottom: 100px;
}

.box section {
    height: 100px;
    background-color: red;
    width: 90%;
    border-radius: 10px;
    padding: 10px;
    margin: 10px;
}

.box section ul {
    height: 70px;
    display: flex;
    justify-content: space-around;
    align-items: center;
    font-size: 14px;
}

.box ol {
    background-color: red;
    width: 90%;
    border-radius: 10px;
    padding: 10px;
    margin: 10px;
    display: flex;
    justify-content: space-around;
    flex-wrap: wrap;
    flex: 1;
}

.box ol li {
    width: 46%;
    height: 120px;
    border: 1px solid black;
    background-color: red;
    margin: 5px;
    border-radius: 5px;
}

.box ol li button {
    border-radius: 20px;
    width: 80px;
}

.box ol li :nth-child(4) {
    display: flex;
    justify-content: space-between;
}
</style>>  